import React, {Component} from 'react'
import {connect} from 'react-redux'
import {HashRouter,Route,Link} from 'react-router-dom'
// HashRouter表示路由容器 所有的路由都要包裹在这个里面  而且只能有一个
// route 表示路由规则 在route上有两个比较重要的属性 path component
//Link 表示一个路由链接 相当于vue中的 router-link
import {userLogin,loadUserInfo} from "./redux/actions/userAction"
//路由拦截
import PrivateRoute from './containers/PrivateRouteContainer';

import indexContainer from "./containers/indexContainer"
import gongGaoContainer from "./containers/gongGaoContainer"
//开奖中心
import awardContainer from "./containers/awardContainer"
import awardCenterItemContainer from "./containers/awardCenterItemContainer"

//发现
import findContainer from "./containers/findContainer"
import activityCenterContainer from "./containers/activityCenterContainer"
import newsContainer from "./containers/newsContainer"
import newsItemContainer from "./containers/newsItemContainer"
import playContainer from "./containers/playContainer"
import playItemContainer from "./containers/playItemContainer"

import allAwardContainer from "./containers/allAwardContainer";
import loginContainer from "./containers/loginContainer";
import registerContainer from "./containers/registerContainer";
import forgetPWContainer from "./containers/forgetPWContainer";

import recordContainer from "./containers/recordContainer";
import recordItemContainer from "./containers/recordItemContainer";
import moneyRecordContainer from "./containers/moneyRecordContainer";
import moneyRecordItemContainer from "./containers/moneyRecordItemContainer";
import awardItemContainer from "./containers/awardItemContainer";
// 彩票投注
import betCenterContainer from "./containers/betCenterContainer";
import OrderMoneyContainer from "./containers/orderMoneyContainer";

//会员 个人中心
import myContainer from "./containers/myContainer"
import myMoneyContainer from "./containers/myMoneyContainer"
import myInfoContainer from "./containers/myInfoContainer"
import todayInputContainer from "./containers/todayInputContainer"
import changeContainer from "./containers/changeContainer"
import wxPayQuickContainer from "./containers/wxPayQuickContainer"
import TraditionPayQuickContainer from "./containers/TraditionPayQuickContainer"
import componyPayContainer from "./containers/componyPayContainer"

import nameChangeContainer from "./containers/nameChangeContainer"
import userPWChangeContainer from "./containers/userPWChangeContainer"
import phoneChangeContainer from "./containers/phoneChangeContainer"
import withdrawContainer from "./containers/withdrawContainer"
import addBankCardContainer from "./containers/addBankCardContainer"
import chatOnlineContainer from "./containers/chatOnlineContainer"
import helpCenterContainer from "./containers/helpCenterContainer"
import userMessageContainer from "./containers/userMessageContainer"


// 组件
export class App extends Component {
    constructor (props){
        super(props)
        this.state= {}
    }
    // 用户刷新页面 需要先发送登录 改变user里面的登录状态 
  componentWillMount() {
    const {dispatch} = this.props;
    dispatch(userLogin());
    // dispatch(loadUserInfo());
  }

  componentDidMount(){
    const { PAGE_START_TIME } = window
    const END_TIME = new Date().getTime() // 结束时间
    const diffTime = END_TIME - PAGE_START_TIME
    console.log("本次页面加载时间为"+diffTime);
    
    const timer = setTimeout(() => {
      clearTimeout(timer)
      document.getElementsByTagName('body')[0].className += ' text-hidden'
    }, diffTime > 2000 ? 0 : 2000 - diffTime)
  }

    render() {
        return <HashRouter>
            <div className="rootdiv">
                <Route exact path="/" component={indexContainer}></Route>
                <Route path="/gonggao" component={gongGaoContainer}></Route>

                <Route exact path="/award" component={awardContainer}></Route>
                <Route path="/award/:key" component={awardCenterItemContainer}></Route>

                <Route path="/find" component={findContainer}></Route>
                <Route path="/activitycenter" component={activityCenterContainer}></Route>
                <Route exact path="/news" component={newsContainer}></Route>
                <Route exact path="/news/:key" component={newsItemContainer}></Route>
                <Route exact path="/play" component={playContainer}></Route>
                <Route exact path="/play/:key" component={playItemContainer}></Route>

                <Route path="/allaward" component={allAwardContainer}></Route>
                <Route path="/awarditem" component={awardItemContainer}></Route>
                <Route path="/login" component={loginContainer}></Route>
                <Route path="/register" component={registerContainer}></Route>
                <Route path="/forget" component={forgetPWContainer}></Route>

                <Route exact path="/my" component={myContainer}></Route>
                <PrivateRoute path="/my/money" component={myMoneyContainer}></PrivateRoute>
                <PrivateRoute path="/my/info" component={myInfoContainer}></PrivateRoute>
                <PrivateRoute path="/record"  component={recordContainer}></PrivateRoute>
                <PrivateRoute path="/my/todayInput"  component={todayInputContainer}></PrivateRoute>
                <Route path="/my/chatOnline"  component={chatOnlineContainer}></Route>
                <Route path="/my/help"  component={helpCenterContainer}></Route>
                <PrivateRoute path="/my/message"  component={userMessageContainer}></PrivateRoute>
                <PrivateRoute exact path="/my/change/user/name/"  component={nameChangeContainer}></PrivateRoute>  
                <PrivateRoute exact path="/my/change/user/phone"  component={phoneChangeContainer}></PrivateRoute> 
                <PrivateRoute exact path="/my/change/money/:key"  component={changeContainer}></PrivateRoute>
                <PrivateRoute exact path="/my/change/:key/"  component={userPWChangeContainer}></PrivateRoute>
                <PrivateRoute path="/my/pay/:key/"  component={wxPayQuickContainer}></PrivateRoute>
                <PrivateRoute path="/my/traditionPay/:key/"  component={TraditionPayQuickContainer}></PrivateRoute>
                <PrivateRoute path="/my/compony/pay/:key/"  component={componyPayContainer}></PrivateRoute>
                <PrivateRoute path="/my/withdraw" component={withdrawContainer}></PrivateRoute>
                <PrivateRoute path="/my/add/bank" component={addBankCardContainer}></PrivateRoute>
                <PrivateRoute path="/my/moneyrecord/:key" component={moneyRecordContainer}></PrivateRoute>
                               

                <Route path="/recorditem" component={recordItemContainer}></Route>
                <Route path="/moneyrecorditem" component={moneyRecordItemContainer}></Route>

                <Route path="/betcenter/:key" component={betCenterContainer}></Route>
                <PrivateRoute path="/ordermoney" component={OrderMoneyContainer}></PrivateRoute>
                
            </div>
        </HashRouter>
    }
}


function mapStateToProps(state) {
    return {
      user: state.user, // 用户中心数据
      award:state.award // 开奖中心数据
    }
  }
  
  export default connect(mapStateToProps)(App)
